వెబ్ సీరియల్ API: వెబ్ బ్రౌజర్‌లు మరియు హార్డ్‌వేర్ పరికరాల మధ్య అంతరాన్ని పూరించడం

వెబ్ సీరియల్ API అనేది ఒక విప్లవాత్మక సాంకేతికత, ఇది వెబ్ డెవలపర్‌లకు వెబ్ బ్రౌజర్ నుండే సీరియల్ పరికరాలతో నేరుగా సంభాషించడానికి అధికారం ఇస్తుంది. ఇది రోబోట్‌లు మరియు ఎంబెడెడ్ సిస్టమ్‌లను నియంత్రించడం నుండి సెన్సార్ డేటాను సేకరించడం మరియు ఇంటరాక్టివ్ భౌతిక అనుభవాలను నిర్మించడం వరకు విస్తృతమైన అవకాశాలను తెరుస్తుంది. ఈ గైడ్ వెబ్ సీరియల్ API, దాని సామర్థ్యాలు, మరియు మీ ప్రాజెక్ట్‌లలో దానిని ఎలా అమలు చేయాలో సమగ్ర అవలోకనాన్ని అందిస్తుంది, ఇది డెవలపర్‌లు మరియు ఔత్సాహికుల ప్రపంచ ప్రేక్షకులకు అందిస్తుంది.

వెబ్ సీరియల్ API అంటే ఏమిటి?

వెబ్ సీరియల్ API వెబ్ అప్లికేషన్‌లను మైక్రోకంట్రోలర్‌లు, ఆర్డుయినో బోర్డులు, 3D ప్రింటర్లు మరియు ఇతర హార్డ్‌వేర్ వంటి సీరియల్ పరికరాలతో బ్రౌజర్ నుండి నేరుగా కమ్యూనికేట్ చేయడానికి అనుమతిస్తుంది. ఇది డేటా కమ్యూనికేషన్ కోసం ఒక ప్రామాణిక ఇంటర్‌ఫేస్ అయిన సీరియల్ పోర్ట్ ద్వారా సాధించబడుతుంది. ప్లగిన్‌లు లేదా నేటివ్ అప్లికేషన్‌లు అవసరమయ్యే మునుపటి పద్ధతులలా కాకుండా, వెబ్ సీరియల్ API హార్డ్‌వేర్‌తో సంభాషించడానికి సురక్షితమైన మరియు ప్రామాణికమైన మార్గాన్ని అందిస్తుంది.

ముఖ్య లక్షణాలు:

• సురక్షిత యాక్సెస్: ఒక నిర్దిష్ట పరికరాన్ని యాక్సెస్ చేయడానికి వినియోగదారు నుండి స్పష్టమైన అనుమతి అవసరం, ఇది భద్రతను పెంచుతుంది.
• క్రాస్-ప్లాట్‌ఫారమ్ అనుకూలత: Windows, macOS, Linux, మరియు ChromeOS వంటి వివిధ ఆపరేటింగ్ సిస్టమ్‌లలో పనిచేస్తుంది, ఇది ఒక స్థిరమైన అనుభవాన్ని అందిస్తుంది.
• ప్రామాణిక API: సీరియల్ పరికరాలతో సంభాషించడానికి స్థిరమైన మరియు ఉపయోగించడానికి సులభమైన జావాస్క్రిప్ట్ APIని అందిస్తుంది.
• డేటా స్ట్రీమింగ్: రియల్-టైమ్ డేటా స్ట్రీమింగ్‌కు మద్దతు ఇస్తుంది, ఇది ప్రత్యక్ష డేటా విజువలైజేషన్ మరియు ఇంటరాక్షన్‌ను అనుమతిస్తుంది.
• ద్విదిశాత్మక కమ్యూనికేషన్: వెబ్ అప్లికేషన్ మరియు హార్డ్‌వేర్ పరికరం మధ్య డేటాను పంపడం మరియు స్వీకరించడాన్ని సులభతరం చేస్తుంది.

వెబ్ సీరియల్ APIని ఉపయోగించడం వల్ల ప్రయోజనాలు

వెబ్ సీరియల్ API డెవలపర్‌లకు అనేక ప్రయోజనాలను అందిస్తుంది, వాటిలో:

• సరళీకృత అభివృద్ధి: ప్లాట్‌ఫారమ్-నిర్దిష్ట ప్లగిన్‌లు లేదా నేటివ్ అప్లికేషన్ అభివృద్ధి అవసరాన్ని తొలగిస్తుంది, అభివృద్ధి ప్రక్రియను సులభతరం చేస్తుంది.
• మెరుగైన యాక్సెసిబిలిటీ: హార్డ్‌వేర్ ఇంటరాక్షన్‌ను విస్తృత ప్రేక్షకులకు మరింత అందుబాటులోకి తెస్తుంది, ఎందుకంటే వినియోగదారులు వారి వెబ్ బ్రౌజర్‌ల నుండి నేరుగా పరికరాలను నియంత్రించవచ్చు.
• మెరుగైన వినియోగదారు అనుభవం: మరింత అతుకులు లేని మరియు స్పష్టమైన వినియోగదారు అనుభవాన్ని అందిస్తుంది, ఎందుకంటే వినియోగదారులు అదనపు సాఫ్ట్‌వేర్‌ను ఇన్‌స్టాల్ చేయకుండా హార్డ్‌వేర్‌తో సంభాషించవచ్చు.
• పెరిగిన ఇంటరాక్టివిటీ: భౌతిక ప్రపంచంతో అనుసంధానించబడిన అధిక ఇంటరాక్టివ్ వెబ్ అప్లికేషన్‌ల సృష్టిని అనుమతిస్తుంది.
• ప్రపంచవ్యాప్త రీచ్: వెబ్ సీరియల్ APIతో నిర్మించిన వెబ్ అప్లికేషన్‌లను వెబ్ బ్రౌజర్ మరియు ఇంటర్నెట్ కనెక్షన్ ఉన్న ఏ పరికరం నుండి అయినా యాక్సెస్ చేయవచ్చు, ఇది ప్రపంచవ్యాప్త సహకారం మరియు ఆవిష్కరణలను సులభతరం చేస్తుంది.

వినియోగ సందర్భాలు మరియు ఉదాహరణలు

వెబ్ సీరియల్ APIని విస్తృత శ్రేణి ప్రాజెక్ట్‌లు మరియు అప్లికేషన్‌లకు వర్తింపజేయవచ్చు, వాటితో సహా:

• ఇంటర్నెట్ ఆఫ్ థింగ్స్ (IoT): మైక్రోకంట్రోలర్‌ల నుండి సెన్సార్ డేటాకు వెబ్ అప్లికేషన్‌లను కనెక్ట్ చేయడం, పర్యావరణ పర్యవేక్షణ, స్మార్ట్ హోమ్ నియంత్రణ, మరియు పారిశ్రామిక ఆటోమేషన్ కోసం డాష్‌బోర్డ్‌లను సృష్టించడం. నెదర్లాండ్స్‌లోని గ్రీన్‌హౌస్‌లో ఉష్ణోగ్రతను పర్యవేక్షించడం లేదా కెన్యాలోని ఒక వ్యవసాయ క్షేత్రంలో నేల తేమను ట్రాక్ చేయడం వంటి విభిన్న ప్రదేశాలలో అనువర్తనాలను పరిగణించండి.
• రోబోటిక్స్ మరియు ఆటోమేషన్: రోబోట్‌లు, డ్రోన్‌లు, మరియు ఇతర ఆటోమేటెడ్ సిస్టమ్‌లను వెబ్ ఇంటర్‌ఫేస్ నుండి నేరుగా నియంత్రించడం. ఇది విద్యా ప్రయోజనాల కోసం (ఉదా., జపాన్‌లోని ఒక పాఠశాలలో రోబోట్ ప్రోగ్రామింగ్) లేదా పారిశ్రామిక ఆటోమేషన్ కోసం (ఉదా., జర్మనీలో ఒక తయారీ లైన్‌ను నియంత్రించడం) ఉపయోగించవచ్చు.
• 3D ప్రింటింగ్ నియంత్రణ: 3D ప్రింటర్‌లను వెబ్ బ్రౌజర్ నుండి నేరుగా నిర్వహించడం మరియు పర్యవేక్షించడం, వినియోగదారులను రిమోట్‌గా ప్రింట్ జాబ్‌లను అప్‌లోడ్ చేయడానికి మరియు నియంత్రించడానికి అనుమతిస్తుంది. ఇది యునైటెడ్ స్టేట్స్ లేదా భారతదేశం వంటి దేశాలలో చూసినట్లుగా, పంపిణీ చేయబడిన తయారీ మరియు మేకర్‌స్పేస్‌లలో ప్రత్యేకంగా ఉపయోగపడుతుంది.
• డేటా అక్విజిషన్ మరియు విజువలైజేషన్: సెన్సార్ల నుండి డేటాను (ఉదా., ఉష్ణోగ్రత, పీడనం, కాంతి) సేకరించడం మరియు దానిని వెబ్ డాష్‌బోర్డ్‌లో నిజ సమయంలో ప్రదర్శించడం. ఇది కెనడాలో శాస్త్రీయ పరిశోధన నుండి బ్రెజిల్‌లో వ్యవసాయ పర్యవేక్షణ వరకు విస్తృత అనువర్తనాన్ని కలిగి ఉంది.
• విద్యా ప్రాజెక్ట్‌లు: విద్యార్థులకు ఎలక్ట్రానిక్స్, ప్రోగ్రామింగ్, మరియు హార్డ్‌వేర్ ఇంటరాక్షన్ గురించి బోధించడం. వెబ్ సీరియల్ API యొక్క సరళత ప్రపంచవ్యాప్తంగా అన్ని వయస్సుల మరియు నేపథ్యాల విద్యార్థులకు అందుబాటులో ఉంటుంది.
• ఇంటరాక్టివ్ ఇన్‌స్టాలేషన్‌లు: వినియోగదారు ఇన్‌పుట్ లేదా సెన్సార్ డేటాకు ప్రతిస్పందించే ఆకర్షణీయమైన మరియు ఇంటరాక్టివ్ ఇన్‌స్టాలేషన్‌లను సృష్టించడం. ఉదాహరణలలో ఆర్ట్ ఇన్‌స్టాలేషన్‌లు లేదా మ్యూజియం ప్రదర్శనలు ఉన్నాయి, ఆస్ట్రేలియా వంటి దేశాలలో భౌతిక కంప్యూటింగ్‌ను ఉపయోగించుకోవడం.

ఉదాహరణ: ఒక ఆర్డుయినో బోర్డును నియంత్రించడం

ఆర్డుయినో బోర్డుకు కనెక్ట్ చేయబడిన LEDని నియంత్రించడానికి ఒక సాధారణ ఉదాహరణను సృష్టిద్దాం. ఆర్డుయినోకు ఆదేశాలను పంపడానికి మేము జావాస్క్రిప్ట్‌ను ఉపయోగిస్తాము, మరియు ఆర్డుయినో LEDని ఆన్ లేదా ఆఫ్ చేయడం ద్వారా ప్రతిస్పందిస్తుంది.

1. ఆర్డుయినో కోడ్ (ఆర్డుయినో IDE):

            const int ledPin = 13;

void setup() {
  pinMode(ledPin, OUTPUT);
  Serial.begin(9600);
}

void loop() {
  if (Serial.available() > 0) {
    char command = Serial.read();
    if (command == '1') {
      digitalWrite(ledPin, HIGH);
      Serial.println("LED ON");
    } else if (command == '0') {
      digitalWrite(ledPin, LOW);
      Serial.println("LED OFF");
    }
  }
}
            

              
                Copy
              
            
          

ఈ ఆర్డుయినో కోడ్:

• LED పిన్‌ను అవుట్‌పుట్‌గా సెట్ చేస్తుంది.
• 9600 బాడ్‌లో సీరియల్ కమ్యూనికేషన్‌ను ప్రారంభిస్తుంది.
• ఇన్‌కమింగ్ సీరియల్ డేటా కోసం నిరంతరం తనిఖీ చేస్తుంది.
• డేటా స్వీకరించబడితే, అది అక్షరాన్ని చదువుతుంది.
• అక్షరం '1' అయితే, అది LEDని ఆన్ చేస్తుంది.
• అక్షరం '0' అయితే, అది LEDని ఆఫ్ చేస్తుంది.
• సీరియల్ పోర్ట్‌కు తిరిగి నిర్ధారణ సందేశాన్ని పంపుతుంది.

2. HTML మరియు జావాస్క్రిప్ట్ (వెబ్ బ్రౌజర్):

            <!DOCTYPE html>
<html>
<head>
  <title>Web Serial LED Control</title>
</head>
<body>
  <button id="connectButton">Connect to Arduino</button>
  <button id="onButton" disabled>Turn LED On</button>
  <button id="offButton" disabled>Turn LED Off</button>
  <p id="status">Disconnected</p>

  <script>
    const connectButton = document.getElementById('connectButton');
    const onButton = document.getElementById('onButton');
    const offButton = document.getElementById('offButton');
    const status = document.getElementById('status');
    let port;
    let writer;

    async function connect() {
      try {
        port = await navigator.serial.requestPort();
        await port.open({ baudRate: 9600 });
        writer = port.writable.getWriter();
        status.textContent = 'Connected';
        connectButton.disabled = true;
        onButton.disabled = false;
        offButton.disabled = false;
      } catch (error) {
        status.textContent = 'Error: ' + error.message;
      }
    }

    async function sendCommand(command) {
      try {
        const data = new TextEncoder().encode(command);
        await writer.write(data);
      } catch (error) {
        status.textContent = 'Error sending command: ' + error.message;
      }
    }

    async function turnOn() {
      await sendCommand('1');
    }

    async function turnOff() {
      await sendCommand('0');
    }

    connectButton.addEventListener('click', connect);
    onButton.addEventListener('click', turnOn);
    offButton.addEventListener('click', turnOff);
  </script>
</body>
</html>
            

              
                Copy
              
            
          

జావాస్క్రిప్ట్ కోడ్ యొక్క వివరణ:

• కనెక్ట్ బటన్: క్లిక్ చేసినప్పుడు, ఒక సీరియల్ పోర్ట్‌కు యాక్సెస్ కోసం అభ్యర్థిస్తుంది మరియు దానిని తెరవడానికి ప్రయత్నిస్తుంది.
• LED ఆన్/ఆఫ్ బటన్లు: LEDని ఆన్ చేయడానికి "1" ఆదేశాన్ని మరియు LEDని ఆఫ్ చేయడానికి "0" ఆదేశాన్ని పంపుతాయి.
• కనెక్షన్ స్థితి: ప్రస్తుత కనెక్షన్ స్థితిని ప్రదర్శిస్తుంది.
• `navigator.serial.requestPort()`: వినియోగదారుని ఒక సీరియల్ పోర్ట్‌ను ఎంచుకోమని ప్రాంప్ట్ చేస్తుంది.
• `port.open()`: ఎంచుకున్న సీరియల్ పోర్ట్‌ను తెరుస్తుంది. `baudRate` పారామీటర్ ఆర్డుయినో కోడ్‌కు (9600) సరిపోయేలా సెట్ చేయబడింది.
• `port.writable.getWriter()`: సీరియల్ పోర్ట్‌కు డేటాను పంపడానికి ఒక రైటర్‌ను సృష్టిస్తుంది.
• `writer.write(data)`: డేటాను (ఆదేశం) సీరియల్ పోర్ట్‌కు వ్రాస్తుంది.
• ఎర్రర్ హ్యాండ్లింగ్: వినియోగదారుకు ఫీడ్‌బ్యాక్ అందించడానికి ఎర్రర్ హ్యాండ్లింగ్‌ను కలిగి ఉంటుంది.

ఉదాహరణను ఎలా అమలు చేయాలి:

1. ఆర్డుయినోను కనెక్ట్ చేయండి: ఆర్డుయినో బోర్డును USB ద్వారా మీ కంప్యూటర్‌కు కనెక్ట్ చేయండి.
2. ఆర్డుయినో కోడ్‌ను అప్‌లోడ్ చేయండి: ఆర్డుయినో IDEని తెరిచి, అందించిన కోడ్‌ను మీ ఆర్డుయినో బోర్డుకు అప్‌లోడ్ చేయండి.
3. HTML ఫైల్‌ను సృష్టించండి: HTML కోడ్‌ను HTML ఫైల్‌గా సేవ్ చేయండి (ఉదా., `index.html`).
4. HTML ఫైల్‌ను బ్రౌజర్‌లో తెరవండి: వెబ్ సీరియల్ APIకి మద్దతు ఇచ్చే వెబ్ బ్రౌజర్‌లో (ఉదా., Chrome, Edge, మరియు Opera యొక్క కొన్ని వెర్షన్‌లు) `index.html` ఫైల్‌ను తెరవండి.
5. కనెక్ట్ చేసి నియంత్రించండి: "Connect to Arduino" బటన్‌పై క్లిక్ చేయండి. మీ బ్రౌజర్ మిమ్మల్ని ఒక సీరియల్ పోర్ట్‌ను ఎంచుకోమని అడుగుతుంది. ఆర్డుయినోను ఎంచుకోండి. ఆపై, LEDని నియంత్రించడానికి "Turn LED On" మరియు "Turn LED Off" బటన్‌లపై క్లిక్ చేయండి.

వెబ్ సీరియల్ APIతో ప్రారంభించడం

వెబ్ సీరియల్ APIని ఉపయోగించడం ప్రారంభించడానికి, మీకు ఈ క్రిందివి అవసరం:

• వెబ్ సీరియల్ APIకి మద్దతు ఇచ్చే వెబ్ బ్రౌజర్: ప్రస్తుతం Chrome, Edge, మరియు Opera యొక్క కొన్ని వెర్షన్‌ల ద్వారా మద్దతు ఉంది. Can I Use వంటి వనరులపై బ్రౌజర్ అనుకూలతను తనిఖీ చేయండి.
• ఒక హార్డ్‌వేర్ పరికరం: ఆర్డుయినో, రాస్ప్‌బెర్రీ పై, లేదా సీరియల్ పోర్ట్ ద్వారా కమ్యూనికేట్ చేసే ఏ పరికరం అయినా.
• HTML, CSS, మరియు జావాస్క్రిప్ట్ యొక్క ప్రాథమిక జ్ఞానం: ఈ వెబ్ టెక్నాలజీలతో పరిచయం అవసరం.

దశలవారీ మార్గదర్శిని:

1. సీరియల్ పోర్ట్ యాక్సెస్ కోసం అభ్యర్థన: వినియోగదారుని ఒక సీరియల్ పోర్ట్‌ను ఎంచుకోమని ప్రాంప్ట్ చేయడానికి `navigator.serial.requestPort()` ఉపయోగించండి. ఈ ఫంక్షన్ `SerialPort` ఆబ్జెక్ట్‌కు పరిష్కారమయ్యే ఒక ప్రామిస్‌ను తిరిగి ఇస్తుంది. గమనిక: `requestPort()`ను ట్రిగ్గర్ చేయడానికి సాధారణంగా వినియోగదారు పరస్పర చర్య (ఒక బటన్ క్లిక్) అవసరం.
2. సీరియల్ పోర్ట్‌ను తెరవండి: బాడ్ రేట్ మరియు ఇతర సీరియల్ పోర్ట్ సెట్టింగ్‌లను (ఉదా., dataBits, stopBits, parity) పేర్కొనే కాన్ఫిగరేషన్ ఆబ్జెక్ట్‌ను పంపుతూ `port.open()` పద్ధతిని కాల్ చేయండి. బాడ్ రేట్ మీ హార్డ్‌వేర్ పరికరం ఉపయోగించే రేట్‌తో సరిపోలాలి.
3. రీడబుల్ మరియు రైటబుల్ స్ట్రీమ్‌లను పొందండి: రీడబుల్ మరియు రైటబుల్ స్ట్రీమ్‌లను పొందడానికి `port.readable` మరియు `port.writable` లక్షణాలను ఉపయోగించండి. ఈ స్ట్రీమ్‌లు డేటాను పంపడం మరియు స్వీకరించడం కోసం ఉపయోగించబడతాయి.
4. ఒక రైటర్‌ను సృష్టించండి: `port.writable.getWriter()` పద్ధతిని ఉపయోగించి ఒక `writer` ఆబ్జెక్ట్‌ను సృష్టించండి, దానిని మీరు పరికరానికి డేటాను పంపడానికి ఉపయోగిస్తారు.
5. ఒక రీడర్‌ను సృష్టించండి: `port.readable.getReader()` పద్ధతిని ఉపయోగించి ఒక `reader` ఆబ్జెక్ట్‌ను సృష్టించండి, దానిని మీరు పరికరం నుండి డేటాను స్వీకరించడానికి ఉపయోగిస్తారు.
6. పరికరంకు డేటాను వ్రాయండి: సీరియల్ పోర్ట్‌కు డేటాను పంపడానికి `writer.write(data)` ఉపయోగించండి. `data` ఒక `ArrayBuffer` లేదా `Uint8Array` అయి ఉండాలి. ఒక స్ట్రింగ్‌ను `Uint8Array`గా మార్చడానికి మీరు `TextEncoder`ని ఉపయోగించవచ్చు.
7. పరికరం నుండి డేటాను చదవండి: సీరియల్ పోర్ట్ నుండి డేటాను చదవడానికి `reader.read()` ఉపయోగించండి. ఈ పద్ధతి డేటాను మరియు స్ట్రీమ్ మూసివేయబడిందో లేదో సూచించే బూలియన్‌ను కలిగి ఉన్న ఆబ్జెక్ట్‌కు పరిష్కారమయ్యే ఒక ప్రామిస్‌ను తిరిగి ఇస్తుంది.
8. సీరియల్ పోర్ట్‌ను మూసివేయండి: పూర్తి అయినప్పుడు, స్ట్రీమ్‌లను మూసివేయడానికి `writer.close()` మరియు `reader.cancel()` కాల్ చేయండి, ఆపై సీరియల్ పోర్ట్‌ను మూసివేయడానికి `port.close()` కాల్ చేయండి. సీరియల్ కమ్యూనికేషన్‌తో సంభావ్య సమస్యలను నిర్వహించడానికి ఎల్లప్పుడూ ఎర్రర్ హ్యాండ్లింగ్‌ను చేర్చండి.

కోడ్ ఉదాహరణలు మరియు ఉత్తమ పద్ధతులు

వెబ్ సీరియల్ APIతో పనిచేయడానికి ఇక్కడ మరిన్ని కోడ్ స్నిప్పెట్‌లు మరియు ఉత్తమ పద్ధతులు ఉన్నాయి:

1. ఒక సీరియల్ పోర్ట్‌ను అభ్యర్థించడం:

            async function requestSerialPort() {
  try {
    const port = await navigator.serial.requestPort();
    return port;
  } catch (error) {
    console.error('Error requesting port:', error);
    return null;
  }
}
            

              
                Copy
              
            
          

2. సీరియల్ పోర్ట్‌ను తెరవడం మరియు కాన్ఫిగర్ చేయడం:

            async function openSerialPort(port) {
  try {
    await port.open({
      baudRate: 115200, // Adjust to match your device
      dataBits: 8,
      stopBits: 1,
      parity: 'none',
    });
    return port;
  } catch (error) {
    console.error('Error opening port:', error);
    return null;
  }
}
            

              
                Copy
              
            
          

3. సీరియల్ పోర్ట్‌కు డేటాను వ్రాయడం (స్ట్రింగ్):

            async function writeToSerialPort(port, data) {
  const encoder = new TextEncoder();
  const writer = port.writable.getWriter();
  try {
    await writer.write(encoder.encode(data));
  } catch (error) {
    console.error('Error writing to port:', error);
  } finally {
    writer.releaseLock();
  }
}
            

              
                Copy
              
            
          

4. సీరియల్ పోర్ట్ నుండి డేటాను చదవడం:

            async function readFromSerialPort(port, callback) {
  const reader = port.readable.getReader();
  try {
    while (true) {
      const { value, done } = await reader.read();
      if (done) {
        // Stream closed
        break;
      }
      if (value) {
        const decoder = new TextDecoder();
        const decodedValue = decoder.decode(value);
        callback(decodedValue);
      }
    }
  } catch (error) {
    console.error('Error reading from port:', error);
  } finally {
    reader.releaseLock();
  }
}
            

              
                Copy
              
            
          

5. సీరియల్ పోర్ట్‌ను మూసివేయడం:

            async function closeSerialPort(port) {
  if (port) {
    try {
      await port.close();
    } catch (error) {
      console.error('Error closing port:', error);
    }
  }
}
            

              
                Copy
              
            
          

ఉత్తమ పద్ధతులు:**

            async function startStreaming(port, dataCallback) {
  const reader = port.readable.getReader();
  let decoder = new TextDecoder();
  let buffer = '';

  try {
    while (true) {
      const { value, done } = await reader.read();
      if (done) {
        break; // Stream closed
      }
      if (value) {
        buffer += decoder.decode(value);
        let newlineIndex = buffer.indexOf('\n'); // Or '\r' or similar terminator
        while (newlineIndex > -1) {
          const line = buffer.substring(0, newlineIndex);
          dataCallback(line); // Process the received data line
          buffer = buffer.substring(newlineIndex + 1);
          newlineIndex = buffer.indexOf('\n');
        }
      }
    }
  } catch (error) {
    console.error('Error during streaming:', error);
  } finally {
    reader.releaseLock();
  }
}

            

              
                Copy
              
            
          

            const port = await navigator.serial.requestPort({
  filters: [
    { usbVendorId: 0x2341, // Arduino Vendor ID
      usbProductId: 0x0043 }, // Arduino Uno Product ID
  ],
});
            

              
                Copy